<template>
	<div class="detail-page" :style='{}'>
        <div class="breadcrumb-wrapper" style="width: 100%;">
            <div class="bread_view">
                <el-breadcrumb separator="" class="breadcrumb">
                    <el-breadcrumb-item class="first_breadcrumb" :to="{ path: '/' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item class="second_breadcrumb" v-for="(item,index) in breadList" :key="index">{{item.name}}</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <div class="back_view">
                <el-button class="back_btn" @click="backClick" type="primary">返回</el-button>
            </div>
        </div>
		<div class="detail_view">

			<div class="info_view">
				<div class="title_view">
					<div class="detail_title">
					</div>
				</div>
				<div class="info_item">
					<div class="info_label">学号</div>
					<div  class="info_text" >{{detail.xuehao}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">学生姓名</div>
					<div  class="info_text" >{{detail.xueshengxingming}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">性别</div>
					<div  class="info_text" >{{detail.xingbie}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">学院</div>
					<div  class="info_text" >{{detail.xueyuan}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">专业</div>
					<div  class="info_text" >{{detail.zhuanye}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">年级</div>
					<div  class="info_text" >{{detail.nianji}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">学历</div>
					<div  class="info_text" >{{detail.xueli}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">是否毕业</div>
					<div  class="info_text" >{{detail.shifoubiye}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">毕业年份</div>
					<div  class="info_text" >{{detail.biyenianfen}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">项目负责人</div>
					<div  class="info_text" >{{detail.xiangmufuzeren}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">所在学校</div>
					<div  class="info_text" >{{detail.suozaixuexiao}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">邮箱</div>
					<div  class="info_text" >{{detail.youxiang}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">创业领域</div>
					<div  class="info_text" >{{detail.chuangyelingyu}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">参加过的创业活动</div>
					<div  class="info_text" >{{detail.canjiahuodong}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">参与过的项目</div>
					<div  class="info_text" >{{detail.canyuxiangmu}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">类型</div>
					<div  class="info_text" >{{detail.leixing}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">城市</div>
					<div  class="info_text" >{{detail.chengshi}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">园区</div>
					<div  class="info_text" >{{detail.yuanqu}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">街道</div>
					<div  class="info_text" >{{detail.jiedao}}</div>
				</div>
				<div class="info_item">
					<div class="info_label">邮箱</div>
					<div  class="info_text" >{{detail.email}}</div>
				</div>
				<div class="btn_view">
					<el-button class="edit_btn" type="primary" v-if="btnAuth('chuangyezhe','添加好友')&&detail.id!=user.id" @click="addFriendClick">添加好友</el-button>
					<el-button class="edit_btn" v-if="centerType&&btnAuth('chuangyezhe','修改')" type="primary" @click="editClick">修改</el-button>
					<el-button class="del_btn" v-if="centerType&&btnAuth('chuangyezhe','删除')" type="danger" @click="delClick">删除</el-button>
				</div>
			</div>
		</div>
		<el-tabs type="border-card" v-model="activeName" class="tabs_view">
		</el-tabs>
	</div>
</template>
<script setup>
	import axios from 'axios'
	import moment from 'moment'
	import {
		ref,
		getCurrentInstance,
		watch,
		onUnmounted,
		onMounted,
		nextTick,
		computed
	} from 'vue';
	import {
		ElMessageBox
	} from 'element-plus'
	import {
		useRoute,
		useRouter
	} from 'vue-router';
	import {
		useStore
	} from 'vuex';
	const store = useStore()
	const user = computed(()=>store.getters['user/session'])
	const userAvatar = computed(()=>store.getters['user/avatar'])
	const context = getCurrentInstance()?.appContext.config.globalProperties;
	const route = useRoute()
	const router = useRouter()
	//基础信息
	const tableName = 'chuangyezhe'
	const formName = '创业者'
	//基础信息
	const breadList = ref([{
		name: formName
	}])
	//权限验证
	const btnAuth = (e,a)=>{
		if(centerType.value){
			return context?.$toolUtil.isBackAuth(e,a)
		}else{
			return context?.$toolUtil.isAuth(e,a)
		}
	}
	//查看权限验证
	const btnFrontAuth = (e,a)=>{
		if(centerType.value){
			return context?.$toolUtil.isBackAuth(e,a)
		}else{
			return context?.$toolUtil.isFrontAuth(e,a)
		}
	}
	// 返回
	const backClick = () =>{
		history.back()
	}
	// 轮播图
	const bannerList = ref([])
	// 详情
	const title = ref('')
	const detail = ref({})
    const activeName = ref('false')
	const getDetail = () => {
		context?.$http({
			url: `${tableName}/detail/${route.query.id}`,
			method: 'get'
		}).then(res => {
            fid.value = res.data.data.id
			detail.value = res.data.data
		})
	}
	// 下载文件
	const downClick = (file) => {
		if(!file){
			context?.$toolUtil.message('文件不存在','error')
		}
		let arr = file.replace(new RegExp('file/', "g"), "")
		axios.get((location.href.split(context?.$config.name).length>1 ? location.href.split(context?.$config.name)[0] :'') + context?.$config.name + '/file/download?fileName=' + arr, {
			headers: {
				token: context?.$toolUtil.storageGet('frontToken')
			},
			responseType: "blob"
		}).then(({
			data
		}) => {
			const binaryData = [];
			binaryData.push(data);
			const objectUrl = window.URL.createObjectURL(new Blob(binaryData, {
				type: 'application/pdf;chartset=UTF-8'
			}))
			const a = document.createElement('a')
			a.href = objectUrl
			a.download = arr
			// a.click()
			// 下面这个写法兼容火狐
			a.dispatchEvent(new MouseEvent('click', {
				bubbles: true,
				cancelable: true,
				view: window
			}))
			window.URL.revokeObjectURL(data)
		})
	}
	// 判断是否从个人中心跳转
	const centerType = ref(false)
	const init = () => {
		if(route.query.centerType){
			centerType.value = true
		}
		getDetail()
	}
	//修改
	const editClick = () => {
		router.push(`/index/${tableName}Add?id=${detail.value.id}&&type=edit`)
	}
	//删除
	const delClick = () => {
		ElMessageBox.confirm(`是否删除此${formName}？`, '提示', {
			confirmButtonText: '是',
			cancelButtonText: '否',
			type: 'warning',
		}).then(()=>{
			context?.$http({
				url: `${tableName}/delete`,
				method: 'post',
				data: [detail.value.id]
			}).then(res=>{
				context?.$toolUtil.message('删除成功','success',()=>{
					history.back()
				})
			})

		})
	}
	const fid = ref('')
	const addFriendClick = ()=> {
		ElMessageBox.confirm('是否发送好友申请？').then(_ => {
			context.$http.get('chatfriend/page',{
				params: {
					uid: fid.value,
					fid: user.value.id,
				}
			}).then(res=>{
				if(res.data&&res.data.code==0){
					if(res.data.data.list.length){
						if(res.data.data.list[0].type==1){
							context.$toolUtil.message('两人已经是好友了！','success')
							return false
						}else if(res.data.data.list[0].type==0){
							context.$toolUtil.message('已经发送了好友申请，请等待对方通过！','success')
							return false
						}
					}
					context.$http.get('chatfriend/page',{
						params: {
							fid: fid.value,
							uid: user.value.id,
							type: 0
						}
					}).then(res=>{
						if(res.data&&res.data.code==0){
							if(res.data.data.list.length){
								context.$toolUtil.message('对方已发送好友申请，请前往个人中心通过','success')
								return false
							}
							context.$http.post('chatfriend/add', {
								uid: fid.value,
								fid: user.value.id,
								type: 0,
								tablename: localStorage.getItem('frontSessionTable'),
								name: localStorage.getItem('frontName'),
								picture: localStorage.getItem('headportrait'),
							}).then(res => {
								if (res.data && res.data.code == 0) {
								context.$toolUtil.message('好友申请发送成功！','success')
								}
							})
						}
					})
				}
			})
		}).catch(_ => {});
	}
	onMounted(()=>{
		init()
	})
</script>
<style lang="scss" scoped>
	// 返回盒子
	.back_view {
		// 返回按钮
		.back_btn {
		}
		// 返回按钮-悬浮
		.back_btn:hover {
		}
	}
	// 面包屑盒子
	.bread_view {
		:deep(.breadcrumb) {
			.el-breadcrumb__separator {
			}
			.first_breadcrumb {
				.el-breadcrumb__inner {
				}
			}
			.second_breadcrumb {
				.el-breadcrumb__inner {
				}
			}
		}
	}

	.detail_view{
		// 轮播图
		.swiper_view {
		}
		// 文字区
		.info_view {

			.title_view {

				.detail_title {
				}
				.collect_view {
					.iconfont {
					}
					.iconfontActive {
					}
					span {
					}
					.textActive {
					}
				}
				.collect_view:hover {
				}
				.collect_view:active {
				}
			}

			.info_item {

				.info_label {
				}
				.info_text {
				}
			}
			.btn_view {
				// 修改-按钮
				.edit_btn {
				}
				// 悬浮
				.edit_btn:hover {
				}
				// 删除-按钮
				.del_btn {
				}
				// 悬浮
				.del_btn:hover {
				}
			}
		}
	}

	//底部盒子
	.tabs_view {
		:deep(.el-tabs__header) {
			background: transparent;
			border: none;
		}
		// 头部
		:deep(.el-tabs__nav-scroll) {
			.el-tabs__nav {
				.el-tabs__item {
				}
				.el-tabs__item:hover {
				}
				.is-active {
				}
			}
		}
		// 内容区
		:deep(.el-tabs__content) {
		}
	}
</style>